* {
    margin: 0;
    padding: 0;
}

body {
    font-size: 14px;
    font-family: "微软雅黑";
}

a {
    text-decoration: none;
}

ul {
    list-style: none;
}

.waitao {
    position: fixed;
    width: 100%;
    height: 111px;
    z-index: 200;
}

#wrap {
    width: 100%;
    header {
        width: 100%;
        height: 30px;
        background: #1e1b29;
        min-width: 1200px;
        .head-list {
            width: 80%;
            height: 100%;
            margin: auto;
            display: flex;
            justify-content: space-between;
            p {
                color: #f60;
                line-height: 30px;
            }
        }
        .head-list-right {
            display: flex;
            justify-content: flex-end;
            color: white;
            height: 17px;
            padding-top: 6px;
            li {
                padding: 0 14px;
                border-right: 1px solid;
                line-height: 17px;
            }
        }
    }
    #nav {
        width: 100%;
        height: 80px;
        background: #eaeaeb;
        min-width: 1200px;
        .nav-center {
            width: 80%;
            margin: auto;
            .p1 {
                margin: 19px 0;
                float: left;
            }
            .nav-1 {
                float: left;
                margin: 20px 0 0 18px;
                border-left: 1px solid #b3b3b3;
                padding-left: 10px;
                height: 30px;
                padding-top: 10px;
            }
            .nav-2 {
                float: left;
                display: flex;
                justify-content: flex-start;
                margin-left: 211px;
                li {
                    padding: 0 30px;
                    font-size: 16px;
                    line-height: 80px;
                    a {
                        color: black;
                    }
                }
                a:hover {
                    color: #f60;
                }
                .posit {
                    position: relative;
                    img {
                        position: absolute;
                        left: 55px;
                        top: 19px;
                    }
                }
            }
            .nav-3 {
                float: right;
                padding-top: 26px;
                padding-right: 10px;
                button {
                    width: 100px;
                    height: 30px;
                    background: #f60;
                    border: none;
                    color: white;
                }
                a {
                    width: 39px;
                    height: 40px;
                    display: inline-block;
                    text-align: right;
                    font-size: 12px;
                    color: #f60;
                }
            }
        }
    }
    .mb {
        height: 50px;
    }
    .globe {
        margin-top: 30px;
        width: 100%;
        background: url("../img/p1-bg_02.png")repeat;
        padding-top: 30px;
        .globe-center {
            text-align: center;
            h1 {
                padding-top: 4px;
                width: 100%;
                color: white;
                font-weight: 500;
                font-size: 38px;
                span {
                    color: #3096ff;
                }
            }
            p {
                font-size: 50px;
                color: #3096ff;
                padding-top: 10px;
            }
            ul {
                padding-top: 15px;
                list-style: none;
                width: 100%;
                overflow: hidden;
                height: 30px;
                position: relative;
                color: white;
                font-size: 22px;
                li {
                    width: 100%;
                    height: 30px;
                }
            }
            .q1 {
                width: 1000px;
                height: 442.4px;
                margin: auto;
                position: relative;
                margin-top: 30px;
                .q2 {
                    width: 100%;
                    height: 63%;
                    z-index: 105;
                    background: url("../img/dfsgdx.png")no-repeat center 30px;
                    position: absolute;
                    top: -30px;
                    left: 0;
                }
                .q3 {
                    position: absolute;
                    width: 600px;
                    height: 200px;
                    background: url("../img/c1.png") no-repeat center center;
                    left: 50%;
                    margin-left: -300px;
                    bottom: 50px;
                    z-index: 100;
                    border-radius: 100%;
                }
                .q4 {
                    width: 800px;
                    height: 300px;
                    background: url("../img/c2.png");
                    margin-left: -400px;
                    position: absolute;
                    bottom: 50px;
                    left: 50%;
                    z-index: 100;
                    border-radius: 100%;
                    -webkit-transform: rotateX(42deg)
                }
                .q5 {
                    bottom: 92px;
                    width: 940px;
                    height: 300px;
                    background: url("../img/c3.png");
                    margin-left: -470px;
                    -webkit-transform: rotateX(-42deg) rotateY(13deg);
                    left: 50%;
                    position: absolute;
                }
                .q6 {
                    bottom: 90px;
                    width: 1200px;
                    height: 300px;
                    background: url("../img/c4.png");
                    margin-left: -600px;
                    -webkit-transform: rotateX(22deg) rotateY(17deg);
                    left: 50%;
                    position: absolute;
                }
                .q7 {
                    position: relative;
                    left: 296px;
                    top: 31px;
                }
            }
        }
    }
    .two-bg {
        width: 100%;
        background: url('../img/p1-bg.jpg') 50% 0 no-repeat;
        height: 756px;
        background-size: cover;
        position: relative;
        .two-banner {
            font-size: 20px;
            text-align: center;
            padding-top: 155px;
            color: #4c4c4c;
            span {
                transition-duration: .5s;
                animation: fadeInUp 2s;
            }
            h1 {
                font-weight: 300;
                padding-top: 18px;
                padding-bottom: 14px;
                font-size: 32px;
                animation: fadeInUp 2s;
            }
            p {
                line-height: 30px;
                font-size: 16px;
                animation: fadeInUp 2s;
            }
        }
    }
    .three-bg {
        width: 100%;
        background: url('../img/p2-bg.jpg') 50% 0 no-repeat;
        height: 720px;
        background-size: cover;
        position: relative;
        .three-banner {
            font-size: 20px;
            text-align: center;
            padding-top: 155px;
            color: white;
            span {
                transition-duration: .5s;
                animation: fadeInUp 2s;
            }
            h1 {
                font-weight: 300;
                padding-top: 18px;
                padding-bottom: 14px;
                font-size: 32px;
                animation: fadeInUp 2s;
            }
            p {
                line-height: 30px;
                font-size: 16px;
                animation: fadeInUp 2s;
            }
        }
    }
    .fore-bg {
        width: 100%;
        background: url('../img/d4-bg.jpg') 50% 0 no-repeat;
        height: 720px;
        background-size: cover;
        position: relative;
        .fore-banner {
            font-size: 20px;
            text-align: center;
            padding-top: 155px;
            color: white;
            span {
                transition-duration: .5s;
                animation: fadeInUp 2s;
            }
            h1 {
                font-weight: 300;
                padding-top: 18px;
                padding-bottom: 14px;
                font-size: 32px;
                animation: fadeInUp 2s;
            }
            p {
                line-height: 30px;
                font-size: 16px;
                animation: fadeInUp 2s;
            }
        }
    }
    .v1 {
        width: 20px;
        position: fixed;
        right: 0;
        top: 382px;
        cursor: pointer;
    }
    .v1 li {
        display: inline-block;
        width: 10px;
        height: 10px;
        background: red;
    }
    .two-banner-main {
        width: 630px;
        height: 340px;
        margin-left: -315px;
        margin-top: -170px;
        bottom: 40px;
        text-align: center;
        position: fixed;
        left: 50%;
        z-index: 5;
        display: block;
        opacity: 1;
        display: none;
        .lateral-phone {
            background: url("../img/iphone72.png") no-repeat 50% 0;
            position: relative;
            width: 100%;
            height: 100%;
            .phone-inside {
                height: 258px;
                margin-top: -151px;
                width: 440px;
                margin-left: -219px;
                position: absolute;
                top: 50%;
                left: 50%;
                overflow: hidden;
                ul {
                    width: 100%;
                    height: 5876px;
                    position: absolute;
                    top: -7px;
                    left: 0;
                    transition: all 1000ms ease;
                    li {
                        width: 494px;
                        height: 280px;
                    }
                    .b1{
                        width: 100%;
                        height: 280px;
                        background: url(../img/p1-phone2.png) no-repeat;
                    }
                    .b2{
                        width: 100%;
                        height: 280px;
                        background: url(../img/p2-phone_032.png) no-repeat;
                    } 
                    .b3{
                        width: 100%;
                        height: 280px;
                        background: url(../img/d4-cghd.png) no-repeat;
                    }  
                }
            }
        }
    }
}